/* HTML: <div class="loading"></div> */
.loading {
  display: inline-flex;
  gap: 10px;
}
.loading:before,
.loading:after {
  content: "";
  height: 30px;
  aspect-ratio: 1;
  border-radius: 50%;
  background: radial-gradient(farthest-side, #000 95%, #0000) 35% 35%/12px 12px no-repeat #fff;
  animation: l5 3s infinite;
}
@keyframes l5 {
  0%,
  11% {
    background-position: 35% 35%;
  }
  14%,
  36% {
    background-position: 65% 35%;
  }
  38%,
  61% {
    background-position: 65% 65%;
  }
  64%,
  86% {
    background-position: 35% 65%;
  }
  88%,
  100% {
    background-position: 35% 35%;
  }
}
